<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>

<head>

	<title><spring:message code="label.accountInfoTitle"/></title>

</head>
<sec:authorize access="hasAnyRole('ROLE_USER', 'ROLE_ADMIN')">
<tiles:insertDefinition name="defaultTemplate">
	<tiles:putAttribute name="body">
	
		<div class="body">
		<!-- Offset, push, and pull resets Reset offsets, pushes, and pulls at specific breakpoints..col-sm-5 -->
			<div class="col-sm-10 col-md-10 ">
				<div class="panel panel-primary">
					<div class="panel-heading">
						<h3 class="panel-title "><spring:message code="label.panelTitle"/></h3>
					</div>
				<!-- Table -->
				<div class="table-responsive">
					<table id="datatable"
						class="table table-striped table-bordered table-hover">
						<thead>

							<tr>
							
								<th><spring:message code="label.information"/></th>
								<th><spring:message code="label.detail"/></th>


							</tr>
						</thead>
						<tbody>


							<c:forEach var="account" items="${listAccount}">
								<tr>								
									<td><b><spring:message code="label.id"/></b></td>									
									<td><fmt:formatNumber pattern="0000000000" value="${account.idaccountInfo}" /></td>
								</tr>
								<tr>											
									<td><b><spring:message code="label.balance"/></b></td>
									<td><span class="badge  lg" ><fmt:formatNumber pattern="#,##0"
														value="${account.balance}"/> </span> <strong>&#8363;</strong></td>
								</tr>
								<tr>
									<td><b><spring:message code="label.accountType"/></b></td>
									<td>${account.accountType}</td>
								</tr>
								<tr>			
									<td><b><spring:message code="label.IDCardNumber"/></b></td>
									<td>							
										<c:out value="${fn:substring(account.idCardNumber,0,3)}-${fn:substring(account.idCardNumber,3,6)}-${fn:substring(account.idCardNumber,6,10)}"/>
									</td>
								</tr>
								
								<tr>								
									<td><b><spring:message code="label.firstName"/></b></td>
									<td>${account.firstName}</td>
								</tr>


								<tr>
									
									<td><b><spring:message code="label.midName"/></b></td>
									<td>${account.midName}</td>
								</tr>
								<tr>
									
									<td><b><spring:message code="label.lastName"/></b></td>
									<td>${account.lastName}</td>
								</tr>

								<tr>
							
									<td><b><spring:message code="label.address"/></b></td>
									<td>${account.addr1}</td>
								</tr>

								<tr>
									
									<td><b><spring:message code="label.phoneNumber"/></b></td>
									<td>${account.phone1}</td>
								</tr>
								<tr>
								
									<td><b><spring:message code="label.email"/></b></td>
									<td>${account.email2}</td>

								</tr>
							</c:forEach>



						</tbody>
					</table>
					</div>
				</div>
			</div>
		</div>

	</tiles:putAttribute>
</tiles:insertDefinition>
</sec:authorize>

<script>
	$(document).ready(function() {
		$('#datatable').DataTable({
			responsive : true,
			"columnDefs": [{ "width": "20%", "targets": 0 }],
			"bPaginate": false,
			"bFilter": false,
			"bSort": false
		});
	});
	$("#accountinfo").addClass('active1'); // activated list-item
	$("#advanceSearch").hide();
	
</script>